let main = document.querySelector("#main")
fetch("http://chst.vip:1234/api/getbrandtitle")
    .then(body => body.json())
    .then(res => {
        let html = ""

        res.result.forEach(item => {
            html += ` <div id="dv" brandtitleid=${item.brandTitleId}>
            <p class="p1">${item.brandTitle}</p>
             <p class="p2">▼</p> 
           </div> 
           <ul class="uu" brandtitleid=${item.brandTitleId}></ul>`
            let leid = item.brandTitleId
            $.ajax({
                url: "http://chst.vip:1234/api/getbrand",
                data: {
                    brandtitleid: leid
                }
            })
                .then(res2 => {
                    let html2 = ""

                    res2.result.forEach((item, index) => {
                        html2 += `
                <li brandId=${item.brandId} title=${item.brandName}>
                    <p class="p3"><span>${index}</span>${item.brandName}</p>
                    <p class="p4">${item.brandInfo}</p>
                </li>
                `
                    })
                    let uu = document.querySelectorAll('.uu')
                    uu[item.brandTitleId].innerHTML = html2
                    let lis = uu[item.brandTitleId].children
                    let span1 = lis[0].children[0].children[0]
                    let span2 = lis[1].children[0].children[0]
                    let span3 = lis[2].children[0].children[0];
                    span2.style.backgroundColor = "#ffa500"
                    span1.style.backgroundColor = "#ff0000";
                    span3.style.backgroundColor = "#adff2f";
                    Array.from(lis).forEach(li => {
                        li.onclick = function () {
                            //Request URL: http://chst.vip:1234/api/getbrandproductlist?brandtitleid=0&pagesize=10
                            let us = this.getAttribute("title")
                            let index = this.getAttribute('brandId')
                            location.href = `./brand.html?brandtitleid=${index}&use=${us}`
                        }
                    })
                })
        })
        main.innerHTML = html
        let dv = document.querySelectorAll("#dv")
        let uu = document.querySelectorAll('.uu')
        dv.forEach(div => {
            div.isClick = false
            div.onclick = function () {
                this.isClick = !this.isClick
                let id = this.getAttribute("brandtitleid")
                if (this.isClick) {
                //     uu.forEach(ul=>{
                //         ul.style.display="none"
                //     })
                    $(".uu").css({"display":"none"})
                    uu[id].style.display = "block"
                } else {
                    uu[id].style.display = "none"
                }
            }
        })
        let btn=document.querySelector("#Top")
        window.onscroll=function(){ 
            btn.onclick=function(){
               document.documentElement.scrollTop=0
            }

        }

    })

